import myCreateElement from './myCreateElement'
import myPatchVnode from './myPatchVnode'
import mySameVnode from './mySameVnode'

export default function myUpdateChildren(parentElm, oldCh, newCh) {
  console.log(oldCh, newCh)
  let oldStartIdx = 0
  let oldEndIdx = oldCh.length - 1
  let newStartIdx = 0
  let newEndIdx = newCh.length - 1

  let oldStartVnode = oldCh[oldStartIdx]
  let oldEndVnode = oldCh[oldEndIdx]
  let newStartVnode = newCh[newStartIdx]
  let newEndVnode = newCh[newEndIdx]

  let keyMap = null

  while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
    // 以下的ifelse是用来处理，当四种情况都没命中的情况下，会出现移动虚拟dom的情况，，移动后的虚拟dom节点会被置为undefined
    //----------------------------------------------------------------
    if (oldCh[oldStartIdx] == undefined) {
      oldStartVnode = oldCh[++oldStartIdx]
    } else if (oldCh[oldEndIdx] == undefined) {
      oldEndVnode = oldCh[--oldStartIdx]
    } else if (newCh[newStartIdx] == undefined) {
      newStartVnode = newCh[--newStartIdx]
    } else if (newCh[newEndIdx] == undefined) {
      newEndVnode = newCh[--newEndIdx]
      //----------------------------------------------------------------
    } else if (mySameVnode(oldStartVnode, newStartVnode)) {
      //命中第一种情况 旧前对新前
      console.log('①旧前对新前')
      myPatchVnode(oldStartVnode, newStartVnode)
      oldStartVnode = oldCh[++oldStartIdx]
      newStartVnode = newCh[++newStartIdx]
    } else if (mySameVnode(oldEndVnode, newEndVnode)) {
      console.log('②旧后对新后')
      myPatchVnode(oldEndVnode, newEndVnode)
      oldEndVnode = oldCh[--oldEndIdx]
      newEndVnode = newCh[--newEndIdx]
    } else if (mySameVnode(oldStartVnode, newEndVnode)) {
      console.log('③旧前对新后')
      myPatchVnode(oldStartVnode, newEndVnode)
      parentElm.insertBefore(oldStartVnode.elm, oldEndVnode.elm.nextSibling)
      oldStartVnode = oldCh[++oldStartIdx]
      newEndVnode = newCh[--newEndIdx]
    } else if (mySameVnode(oldEndVnode, newStartVnode)) {
      console.log('④旧后对新前')
      myPatchVnode(oldEndVnode, newStartVnode)
      parentElm.insertBefore(oldEndVnode.elm, oldStartVnode.elm)
      oldEndVnode = oldCh[--oldEndIdx]
      newStartVnode = newCh[++newStartIdx]
    } else {
      console.log('以上四种都没有命中的情况')
      console.log(keyMap, 'keyMap')
      if (!keyMap) {
        keyMap = {}
        for (let i = oldStartIdx; i <= oldEndIdx; i++) {
          if (oldCh[i] != undefined) {
            const key = oldCh[i].key
            if (key != undefined) {
              keyMap[key] = i
            }
          }
        }
        console.log(keyMap)
      }
      // {a:0,b:1}
      console.log(newStartVnode, 'newStartVnode')
      const oldIndex = keyMap[newStartVnode.key]
      console.log(oldIndex)
      if (oldIndex == undefined) {
        console.log('属于新增的虚拟dom')
        parentElm.insertBefore(
          myCreateElement(newStartVnode),
          oldStartVnode.elm
        )
      } else {
        const moveToMove = oldCh[oldIndex]
        myPatchVnode(moveToMove, newStartVnode)
        oldCh[oldIndex] = undefined
        parentElm.insertBefore(moveToMove.elm, oldStartVnode.elm)
      }
      newStartVnode = newCh[++newStartIdx]
    }
  }
  if (newStartIdx <= newEndIdx) {
    console.log('新的虚拟节点存在多余dom:新增节点')
    for (var i = newStartIdx; i <= newEndIdx; i++) {
      parentElm.insertBefore(myCreateElement(newCh[i]), oldCh[oldEndIdx].elm)
    }
  } else if (oldStartIdx <= oldEndIdx) {
    console.log('旧的虚拟节点存在多余dom:删除节点')
    for (var i = oldStartIdx; i <= oldEndIdx; i++) {
      if (oldCh[i]) parentElm.removeChild(oldCh[i].elm)
    }
  }
}
